import { Upload, message } from 'antd';
import { InboxOutlined } from '@ant-design/icons';
import styles from "./index.less"
import { useDispatch } from 'umi';
import { Fragment } from 'react';
import vEvent from "@/repair";
const { Dragger } = Upload;
let token = localStorage.getItem('token');

interface Iprops {
  upurl: string,
}
const Uploads:React.FC<Iprops> = (prs) => {
   let upurl=prs.upurl;
  const props = {
    name: 'file',
    multiple: true,
    action: 'https://creationapi.shbwyz.com/api/file/upload?unique=0',
    headers: {
      Authorization: `Bearer ${token}`,
    },
    onChange(info: any) {
      const { status } = info.file;
      if (status !== 'uploading') {
        // console.log(info.file, info.fileList);
      }
      if (status === 'done') {
        message.success(`${info.file.name} file uploaded successfully.`);

           vEvent.$emit("send",info.file.response.data.url)

           
      } else if (status === 'error') {
        message.error(`${info.file.name} file upload failed.`);
      }
    },
    onDrop(e: any) {
      console.log('Dropped files', e.dataTransfer.files);
    },
  }
  return <Dragger {...props}>
    {
      upurl ? 
        (<img src={upurl} alt="" className={styles.upload_img} />) :
        <Fragment><p className="ant-upload-drag-icon">
          <InboxOutlined />
        </p>
          <p className="ant-upload-text">点击选择文件或将文件拖拽到此处</p>
          <p className="ant-upload-hint">
            文件将上传到 OSS, 如未配置请先配置
          </p>
          </Fragment>
          
   }
  </Dragger>
}
export default Uploads